<apes-header>
  <apes-button-list class="buttonList" [ctx]="ctx" [buttonBarMetadata]="buttonBar"
                    (click)="onEvent($event)"></apes-button-list>
</apes-header>

<apes-content class="big-box">
  <apes-card [apesBordered]="false">
    <div class="boxShow" apes-row apesGutter="24" apesSpan="16" [ngStyle]="{ display: hidn }" >
      <!-- 维修类型 -->
      <div apes-col apesSpan="8">
        <span>维修类型</span>
        <ng-select style="width: 210px; display: inline-block;"
                   [items]="arrWXLE"
                   bindLabel="label"
                   bindValue="key"
                   [placeholder]="'选填'" [(ngModel)]="ngWXLX" [notFoundText]="'无法找到'" typeToSearchText>
        </ng-select>
      </div>
      <!-- 内协门店 -->
      <div apes-col apesSpan="8">
        <span>内协门店</span>
        <ng-select style="width: 210px; display: inline-block;"
                   clearAllText
                   [items]="arrNXMD"
                   bindLabel="MDMC"
                   bindValue="MDID"
                   [placeholder]="'选填'" [notFoundText]="'无法找到'" typeToSearchText [(ngModel)]="ngNXMD">
        </ng-select>
      </div>
      <!-- 接车基地 -->
      <div apes-col apesSpan="8">
        <span>接车基地</span>
        <ng-select style="width: 210px; display: inline-block;"
                   [items]="arrJCMDMC"
                   bindLabel="MDMC"
                   bindValue="MDID"
                   clearAllText [placeholder]="'选填'" [(ngModel)]="ngJCMDMC" [notFoundText]="'无法找到'" typeToSearchText>
        </ng-select>
      </div>
      <!-- 车牌号码 -->
      <div apes-col apesSpan="8">
        <span>车牌号码</span>
        <input type="text" apes-input placeholder="请输入车牌号码" [(ngModel)]="cphmName" style="width: 210px;">
      </div>
      <!-- 接车人 -->
      <div apes-col apesSpan="8">
        <span>接车人</span>

        <input type="text" apes-input placeholder="请输入接车人姓名" [(ngModel)]="ywyName" style="width: 210px;">

      </div>
      <!-- 门店接车时间 -->
      <div apes-col apesSpan="8">
        <span>门店接车时间</span>
        <div class="boxDiv">
          <apes-range-picker [(ngModel)]='mdjcTime' [apesFormat]="'yyyy-MM-dd'"></apes-range-picker>
        </div>
      </div>
      <!-- 基地接车时间 -->
      <div apes-col apesSpan="8">
        <span>基地接车时间</span>
        <div class="boxDiv">
          <apes-range-picker [(ngModel)]='jdjcTime' [apesFormat]="'yyyy-MM-dd'"></apes-range-picker>
        </div>
      </div>
      <!-- 预计交车时间 -->
      <div apes-col apesSpan="8">
        <span>预计交车时间</span>
        <div class="boxDiv">
          <apes-range-picker [(ngModel)]='yjjcTime' [apesFormat]="'yyyy-MM-dd'"></apes-range-picker>
        </div>
      </div>
      <!-- 服务类型 -->
      <div apes-col apesSpan="8">
        <span>服务类型</span>
        <ng-select style="width: 210px; display: inline-block;"
                   [items]="arrFWLX"
                   bindLabel="FWLXMC"
                   bindValue="FWLXID"
                   clearAllText [placeholder]="'选填'" [(ngModel)]="ngFWLX" [notFoundText]="'无法找到'" typeToSearchText>
        </ng-select>
      </div>
      <!-- 定损全部完成时间 -->
      <div apes-col apesSpan="8">
        <span>定损全部完成时间</span>
        <div class="boxDiv">
          <apes-range-picker [(ngModel)]='dsqbwcTime' [apesFormat]="'yyyy-MM-dd'"></apes-range-picker>
        </div>
      </div>
      <!-- 配件全部到货时间 -->
      <div apes-col apesSpan="8">
        <span>配件全部到货时间</span>
        <div class="boxDiv">
          <apes-range-picker [(ngModel)]='pjqbdhTime' [apesFormat]="'yyyy-MM-dd'"></apes-range-picker>
        </div>
      </div>
      <!-- 进入施工端时间 -->
      <div apes-col apesSpan="8">
        <span>进入施工端时间</span>
        <div class="boxDiv">
          <apes-range-picker [(ngModel)]='jrsgdTime' [apesFormat]="'yyyy-MM-dd'"></apes-range-picker>
        </div>
      </div>
      <!-- 是否已调色 -->
      <div apes-col apesSpan="8">
        <span>是否已调色</span>
        <ng-select style="width: 210px; display: inline-block;"
                   [items]="arrSYF"
                   bindLabel="label"
                   bindValue="key"
                   [placeholder]="'选填'" [(ngModel)]="ngSFYTS" [notFoundText]="'无法找到'" typeToSearchText>
        </ng-select>
      </div>
      <!-- 施工状态 -->
      <div apes-col apesSpan="8">
        <span>施工状态</span>
        <ng-select style="width: 210px; display: inline-block;"
                   [items]="arrSGZT"
                   bindLabel="label"
                   bindValue="key"
                   clearAllText [placeholder]="'选填'" [(ngModel)]="ngCLSGZT" [notFoundText]="'无法找到'" typeToSearchText>
        </ng-select>
      </div>
      <!-- 步骤施工状态 -->
      <div apes-col apesSpan="8">
        <span>步骤施工状态</span>
        <ng-select style="width: 210px; display: inline-block;"
                   [items]="arrBZSGZT"
                   bindLabel="label"
                   bindValue="key"
                   clearAllText [placeholder]="'选填'" [(ngModel)]="ngBZSGZT" [notFoundText]="'无法找到'" typeToSearchText>
        </ng-select>
      </div>
      <!-- 步骤 -->
      <div apes-col apesSpan="8">
        <span>步骤</span>
        <ng-select style="width: 210px; display: inline-block;"
                   [items]="arrGX"
                   bindLabel="label"
                   bindValue="key"
                   clearAllText [placeholder]="'选填'" [(ngModel)]="ngGX" [notFoundText]="'无法找到'" typeToSearchText>
        </ng-select>
      </div>
      <!-- 是否已交车 -->
      <div apes-col apesSpan="8">
        <span>是否已交车</span>
        <ng-select style="width: 210px; display: inline-block;"
                   [items]="arrSYF"
                   bindLabel="label"
                   bindValue="key"
                   [placeholder]="'选填'" [(ngModel)]="ngSFYJC" [notFoundText]="'无法找到'" typeToSearchText>
        </ng-select>
      </div>
      <!-- 交车时间 -->
      <div apes-col apesSpan="8">
        <span>交车时间</span>
        <div class="boxDiv">
          <apes-range-picker [(ngModel)]='jcTime' [apesFormat]="'yyyy-MM-dd'"></apes-range-picker>
        </div>
      </div>

      <div apes-col apesSpan="8">
        <span>公司：</span>
        <ng-select style="width: 240px; display: inline-block;"
                   typeToSearchText
                   [items]="companyData"
                   multiple="true"
                   bindLabel="name"
                   bindValue="id"
                   placeholder="选填，可多选"
                   [(ngModel)]="companyList"
                   [notFoundText]="'无法找到'"
                   (change)="getNxmdData()">
        </ng-select>
      </div>

      <!-- T + 留存 -->
      <div apes-col apesSpan="8">
        <span>T + 留存</span>
        <input type="text" apes-input placeholder="请输入整数" [(ngModel)]="ngTLC" style="width: 210px;">
      </div>

      <!-- 车辆状态 -->
      <div apes-col apesSpan="8">
        <span>车辆状态</span>
        <ng-select style="width: 210px; display: inline-block;"
                   [items]="arrCLZT"
                   bindLabel="label"
                   bindValue="key"
                   [placeholder]="'选填'" [(ngModel)]="ngCLZT" [notFoundText]="'无法找到'" typeToSearchText>
        </ng-select>
      </div>
    </div>

    <div>
      <ag-grid-angular #grid
                       style="width: 100%;" [ngStyle]="{ height: height }" class="ag-theme-balham"
                       enableColResize="true"
                       enableSorting="true"
                       enableFilter="true"

                       suppressLoadingOverlay="true"

                       [rowData]="rowData"
                       [gridOptions]="gridOptions"
                       [columnDefs]="columnDefs"
                       [pinnedBottomRowData]="pinnedBottomRowData"
                       [getContextMenuItems]="getContextMenuItems">
      </ag-grid-angular>
    </div>
  </apes-card>
</apes-content>
